import QtQuick 1.0

Rectangle {
    id:rectItem
    property string name
    property string label
    property string url
    property int index
    property int count
    color: "#91AA9D"
    smooth: true
    border.color:'#193441'
    border.width:2
    x:10
    z:activeFocus?1:0
    opacity:activeFocus?1:0.9
    anchors.verticalCenter:parent.verticalCenter
    property variant lPodDet : Qt.createComponent("detailRub.qml");
    property variant detailObj 
    transform: Rotation {
      id:rotElt
      origin.x: 10
      origin.y: 0
      angle : (90*index)/count - 45
    }
    clip:true
    radius: 10
    //anchors.horizontalCenter:parent.horizontalCenter
    width: 220
    height: 60
    Text {
	anchors.centerIn: rectItem
	text: label
	color: "#193441"
	font.pixelSize: 30
    }
    states: [
      State {
	  name: "active"; when: rectItem.activeFocus
	  PropertyChanges { target: rectItem;scale: 1.3 }
	  //PropertyChanges { target: label; font.pixelSize: 16 }
      }
      ,State {
	  name: "selected"
	  PropertyChanges { target: rectItem;width:800 }
	  PropertyChanges { target: rectItem;height:500 }
	  PropertyChanges { target: rectItem;x:220 }
	  PropertyChanges { target: rotElt; angle:0}
	  //PropertyChanges { target: label; font.pixelSize: 16 }
      }
    ]
    transitions: Transition {
	NumberAnimation { properties: "scale"; duration: 100 }
	NumberAnimation { properties: "width"; duration: 100 }
	NumberAnimation { properties: "height"; duration: 100 }
	NumberAnimation { properties: "x"; duration: 100 }
	NumberAnimation { properties: "angle"; duration: 100 }
    }
    function beforeLeave() {
	try{
	  detailObj.beforeDestroy();
	  detailObj.destroy();
	  detailObj=null;
	}catch(e){
	  console.log('destruction impossible');
	}
    }
    Keys.onReturnPressed : {
	if(state=='selected'){
	  detailObj = lPodDet.createObject(rectItem);
	  detailObj.urlFlux = url;
	  event.accepted = true;
	  return;
	}
	rectItem.state='selected';
	event.accepted = true;
    }
    
    Keys.onLeftPressed : {
	if(state=='selected'){
	  beforeLeave();
	  focus=true;
	  state='active';
	  event.accepted = true;
	  return;
	}
    }
    Keys.onDownPressed : {
	if(state=='selected'){
	  beforeLeave();
	}
	if(parent.navigue(1)){
	  event.accepted = true;
	  state='';
	}
    }
    Keys.onUpPressed : {
	if(state=='selected'){
	  beforeLeave();
	}
	if(parent.navigue(-1)){
	  event.accepted = true;
	  state='';
	}
    }
    
    
} 
